﻿<UserControl x:Class="Songhay.Silverlight.BiggestBox.AdditionalSamplesPart.Views.TransitioningContentControlSample"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    xmlns:galaEx="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.SL5"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:toolkitLayout="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Layout.Toolkit"
    xmlns:vm="clr-namespace:Songhay.Silverlight.BiggestBox.AdditionalSamplesPart.ViewModels"
    Tag="TransitioningContentControl with UserControl Collection Sample"
    Width="512" Height="400">
    <UserControl.Resources>
        <vm:TransitioningContentControlSampleViewModel x:Key="TransitioningContentControlSampleViewModelDataSource" d:IsDataSource="True" />

        <Style TargetType="Button">
            <Setter Property="Cursor" Value="Hand" />
            <Setter Property="Margin" Value="4" />
            <Setter Property="Width" Value="96" />
        </Style>

        <Style TargetType="StackPanel">
            <Setter Property="HorizontalAlignment" Value="Center" />
        </Style>
        <Style x:Key="TransitioningContentControlStyle" TargetType="toolkitLayout:TransitioningContentControl">
            <Setter Property="IsTabStop" Value="True"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Transition" Value="SwapTransition"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="toolkitLayout:TransitioningContentControl">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="2">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="PresentationStates">
                                    <VisualState x:Name="DefaultTransition">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CurrentContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Collapsed</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="UpTransition">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CurrentContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="CurrentContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="30"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="-30"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="DownTransition">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CurrentContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="CurrentContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="-40"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="PreviousContentPresentationSite">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.300" Value="40"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="SwapTransition">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames
                                                BeginTime="00:00:00"
                                                Storyboard.TargetName="CurrentContentPresentationSite"
                                                Storyboard.TargetProperty="(UIElement.Opacity)">
                                                <SplineDoubleKeyFrame KeyTime="0:0:0" Value="0" />
                                                <SplineDoubleKeyFrame KeyTime="0:0:1.5" Value="0" />
                                                <SplineDoubleKeyFrame KeyTime="0:0:2.5" Value="1" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames
                                                BeginTime="00:00:00"
                                                Storyboard.TargetName="CurrentContentPresentationSite"
                                                Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                                                <EasingDoubleKeyFrame KeyTime="0:0:1.5" Value="-480"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:2.5" Value="0">
                                                    <EasingDoubleKeyFrame.EasingFunction>
                                                        <BackEase EasingMode="EaseOut" Amplitude="1.25" />
                                                    </EasingDoubleKeyFrame.EasingFunction>
                                                </EasingDoubleKeyFrame>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames
                                                BeginTime="00:00:00"
                                                Storyboard.TargetName="PreviousContentPresentationSite"
                                                Storyboard.TargetProperty="(UIElement.Opacity)">
                                                <SplineDoubleKeyFrame KeyTime="00:00:00.75" Value="1" />
                                                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames
                                                BeginTime="00:00:00"
                                                Storyboard.TargetName="PreviousContentPresentationSite"
                                                Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                                                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-480">
                                                    <EasingDoubleKeyFrame.EasingFunction>
                                                        <BackEase EasingMode="EaseInOut" Amplitude="1.25" />
                                                    </EasingDoubleKeyFrame.EasingFunction>
                                                </EasingDoubleKeyFrame>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid>
                                <ContentPresenter x:Name="PreviousContentPresentationSite" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{x:Null}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                    <ContentPresenter.RenderTransform>
                                        <TransformGroup>
                                            <ScaleTransform/>
                                            <SkewTransform/>
                                            <RotateTransform/>
                                            <TranslateTransform/>
                                        </TransformGroup>
                                    </ContentPresenter.RenderTransform>
                                </ContentPresenter>
                                <ContentPresenter x:Name="CurrentContentPresentationSite" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{x:Null}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                    <ContentPresenter.RenderTransform>
                                        <TransformGroup>
                                            <ScaleTransform/>
                                            <SkewTransform/>
                                            <RotateTransform/>
                                            <TranslateTransform/>
                                        </TransformGroup>
                                    </ContentPresenter.RenderTransform>
                                </ContentPresenter>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </UserControl.Resources>

    <UserControl.DataContext>
        <Binding Source="{StaticResource TransitioningContentControlSampleViewModelDataSource}" />
    </UserControl.DataContext>

    <StackPanel>
        <toolkitLayout:TransitioningContentControl
            Content="{Binding CurrentlySelectedControl}"
            Style="{StaticResource TransitioningContentControlStyle}"
            Width="480" Height="320">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="TransitionCompleted">
                    <galaEx:EventToCommand
                        Command="{Binding TransitionCompletedCommand, Mode=OneWay}"
                        />
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </toolkitLayout:TransitioningContentControl>
        <StackPanel Orientation="Horizontal">
            <Button
                Command="{Binding PreviousItemInCollectionCommand}"
                Content="Previous"
                />
            <Button
                Command="{Binding NextItemInCollectionCommand}"
                Content="Next"
                />
        </StackPanel>
    </StackPanel>
</UserControl>
